import React from 'react';
import { Table } from 'antd';

const ZpfxCard = ({ data }) => {
    const columns = [
        {
            title: '人数',
            dataIndex: 'name'
        },
        {
            title: '说明',
            dataIndex: 'explain'
        }
    ];
    const tableDataList = [
        { name: <span>候选人：{data.candidateNum}</span>, explain: <span>涉及{data.recruitPostNum}个招聘职位 </span> },
        {
            name: (
                <span>
                    筛选/通过：{data.filterNum}/{data.filterPassNum}
                </span>
            ),
            explain: <span>通过率{data.filterPassRate}%</span>
        },
        {
            name: (
                <span>
                    {' '}
                    面试/通过：{data.interviewNum}/{data.interviewPassNum}
                </span>
            ),
            explain: (
                <span>
                    通过率{data.interviewPassRate}%，专业初试淘汰{data.interviewProfessionFirstOutNum}人， 专业复试淘汰
                    {data.interviewProfessionSecondOutNum}人，HR复试淘汰{data.interviewHrOutNum}人
                </span>
            )
        },
        {
            name: (
                <span>
                    录用/接受：{data.offerNum}/{data.offerAcceptNum}
                </span>
            ),
            explain: <span>offer接受率{data.offerAcceptRate}%</span>
        },
        { name: <span>入职：{data.entryNum}</span>, explain: <span>报到率：{data.entryRate}%</span> }
    ];
    return (
        <Table
            size="small"
            columns={columns}
            dataSource={tableDataList}
            pagination={false}
            bordered
            style={{ marginTop: '50px' }}
        />
    );
};

export default ZpfxCard;
